<template>
  <div>
<h1>{{ count }}</h1>
<button @click="add">count++</button>
<hr>
<h2>{{ doubleCount }}</h2>
<input type="text">
  </div>
</template>

<script>
  export default {
    data(){
      return{
        count:10
      }
    },
    methods:{
      add(){
        this.count++
      }
    },
    computed:{
      doubleCount(){
        return this.count*2
      }
    },
    watch:{
      count(newV,oldV){
        console.log('newV,oldV  ----->  ', newV,oldV);
      }
    },
    beforeMount(){
      const ipt = document.querySelector('input')
      console.log('挂载前  ----->  ',ipt);
    },
    mounted(){
      const ipt = document.querySelector('input')
      console.log('挂载后  ----->  ',ipt);
    },
  }
</script>





